<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:body>
        <ui:composition template="./../template/main.xhtml">
            <ui:define name="content">
                <h1 class="title ui-widget-header ui-corner-all ">Quản Lý Bình Luận </h1>
                <p:growl id="messages"/>
                <p:outputPanel deferred="true">
              
                <h:form id="formDataTable">
                    <p:dataTable style="text-align: center" id="commentform" var="comment" value="#{commentController.listcomment}" paginator="true" rows="10" 
                                 paginatorTemplate="{RowsPerPageDropdown} {FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}" rowsPerPageTemplate="5,10,15" 
                                 emptyMessage="Không tìm thấy bình luận nào...">

                        <p:column headerText="ID" style="width:5%; text-align: center" sortBy="#{comment.id}" filterBy="#{comment.id}">
                            <h:outputText value="#{comment.id}" />
                        </p:column>
                        <p:column headerText="Điện thoại" style="width:5%; text-align: center" sortBy="#{comment.phone.name}" filterBy="#{comment.phone.name}">
                            <h:outputText value="#{comment.phone.name}" />
                        </p:column>
                        <p:column headerText="Nội dung" style="width:5%; text-align: center" sortBy="#{comment.content}" filterBy="#{comment.content}">
                            <h:outputText value="#{comment.content}" />
                        </p:column>
                        <p:column headerText="Email" style="width:5%; text-align: center" sortBy="#{comment.email}" filterBy="#{comment.email}">
                            <h:outputText value="#{comment.email}" />                             
                        </p:column>
                        <p:column headerText="Duyệt?" style="width:5%; text-align: center" sortBy="#{comment.approve}">
                           <p:selectBooleanCheckbox value="#{comment.approve}" />
                        </p:column>
                        <p:column headerText="Hành động" style="width:15%" >
                            <p:commandButton style="padding-right: 5px;" id="btnUpdate" update=":formUpdate" oncomplete="PF('dialogUpdate').show()" icon="ui-icon ui-icon-wrench" title="Duyệt Bình luận">
                                <f:setPropertyActionListener value="#{comment}" target="#{commentController.selectcomment}" />  
                            </p:commandButton>    
                             <p:commandButton id="btnDelete" update=":formDelete" oncomplete="PF('confirmation').show()" icon="ui-icon-close" title="Xóa Bình Luận">
                                <f:setPropertyActionListener value="#{comment}" target="#{commentController.selectcomment}" />  
                            </p:commandButton>
                        </p:column>
                         
                    </p:dataTable>  
                </h:form>
                   <h:form id="formUpdate">
                    <p:dialog header="Duyệt Bình Luận" widgetVar="dialogUpdate" resizable="false"
                              showEffect="fade" hideEffect="explode" modal="true">  
                        <h:panelGrid id="display" columns="2" cellpadding="4" style="margin:10px;">
                            
                            <h:outputLabel for="approve"  value="Duyệt" style="padding: 2px" />  
                           
                            <p:selectBooleanCheckbox id="approve" value="#{commentController.selectcomment.approve}"/>
                            <f:facet name="footer">
                                <p:separator/>
                                <p:commandButton actionListener="#{commentController.btnUpdate()}" id="btnUpdateAccept" update=":formDataTable, :messages" oncomplete="dialogUpdate.hide();" icon="icon-create" title="Update" value="Update"/>
                                <p:commandButton id="btnUpdateCancel" action="#{commentController.resetSelectComment()}" oncomplete="dialogUpdate.hide();" icon="icon-cancel" title="Cancel" value="Cancel"/>
                            </f:facet>
                        </h:panelGrid>  
                    </p:dialog>  
                </h:form>  
                     <h:form id="formDelete">
                    <p:confirmDialog closable="false" showEffect="fade" hideEffect="explode" severity="alert" widgetVar="confirmation"
                                     message="Bạn có muốn xóa bình luận?" header="Xóa bình luận" style="margin:5px auto;">
                        <h:panelGroup layout="block" style="text-align: right">
                            <p:commandButton value="Yes" action="#{commentController.btnDelete()}" update=":formDataTable, :messages" oncomplete="confirmation.hide();" />
                            <p:commandButton value="No" action="#{commentController.resetSelectComment()}" oncomplete="confirmation.hide();" />
                        </h:panelGroup>
                    </p:confirmDialog>
                </h:form>
                </p:outputPanel>
            </ui:define>
        </ui:composition>
    </h:body>
</html>
